/* YUI 3.5.0 reset.css (http://developer.yahoo.com/yui/3/cssreset/) - http://cssreset.com */
html {
	color: #000;
	background: #FFF
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

fieldset, img {
	border: 0
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal
}

ol, ul {
	list-style: none
}

caption, th {
	text-align: left
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal
}

q:before, q:after {
	content: ''
}

abbr, acronym {
	border: 0;
	font-variant: normal
}

sup {
	vertical-align: text-top
}

sub {
	vertical-align: text-bottom
}

input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit
}

input, textarea, select {
	*font-size: 100%
}

legend {
	color: #000
}

#yui3-css-stamp.cssreset {
	display: none
}

.rounded(@value) {
	-moz-border-radius: @value;
	-webkit-border-radius: @value;
	border-radius: @value;
	behavior: url(http://www.100msm.com/assets/PIE-1.0.0/PIE.htc);
}

.yahei() {
	font-family: "\5FAE\8F6F\96C5\9ED1", "\5B8B\4F53";
}


@image_base_url: "http://app100678863.qzone.qzoneapp.com/assets/images/meili";

body {
	line-height: 1.5;
	font-size: 12px;
	color: #2c2c2c;
	background-color: #f5f5f5;
}

strong {
	font-weight: normal;
	vertical-align: middle;
}

p {
	margin: 0;
}

ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

a {
	text-decoration: none;
	&:hover {
		text-decoration: none;
	}
}

#main {
	width: 760px;
}

#header {
	height: 136px;
	width: 760px;
	margin-bottom: 3px;
	position: relative;

	img {
		height: 136px;
		width: 760px;
	}
}

#user-avatar {
	position: absolute;
	left: 450px;
	top: 8px;

	a {
		display: block;

		img {
			width: 50px;
			height: 50px;
		}
	}
}

#login-info {
	position: absolute;
	left: 516px;
	top: 14px;

	strong {
		color: #f00;
	}
}

#checkin-btn {
	width: 77px;
	height: 29px;
	position: absolute;
	right: 41px;
	top: 19px;
	display: block;
	text-indent: -9999px;
	background: url("@{image_base_url}/btn_get.png") 0 0 no-repeat transparent;

	&.disabled {
		background-position: 0 -32px;
	}
}

#nav {
	overflow: hidden;
	margin-bottom: 34px;
}

#nav-bar {
	float: left;
	background-color: #fee191;
	width: 650px;
	height: 31px;
	.rounded(3px);
	-webkit-box-shadow: 0 8px 6px -6px #ddd;
	-moz-box-shadow: 0 8px 6px -6px #ddd;
	box-shadow: 0 8px 6px -6px #ddd;
}

#nav-day {
	float: left;
	padding-top: 8px;
	margin-right: 45px;

	ul {
		overflow: hidden;
		li {
			float: left;
		}
	}

	a {
		display: block;
		color: #780804;
	}
}

#nav-day-today {
	a {
		font-weight: bold;
		padding: 0 14px 0 11px;
		border-right: 1px solid #780804;

	}
}

#nav-day-yesterday {
	a {
		padding-left: 13px;
	}
}

#nav-tag {
	float: left;
	padding-top: 2px;
	margin-right: 45px;

	ul {
		overflow: hidden;

	}

	li {
		float: left;
		margin-left: 7px;
	}

	.first {
		margin: 0;
	}

	a {
		display: block;
		color: #780804;
		padding: 0 9px;
		line-height: 26px;
	}

	.active {
		a {
			color: #fee191;
			background-color: #ec4235;
			.rounded(3px);
		}
	}
}

#nav-wardrobe {
	float: right;

	a {
		display: block;
		width: 98px;
		height: 32px;
		background: url("@{image_base_url}/wordrobe.png") 0 0 no-repeat transparent;
		text-indent: -9999px;
	}
}

#slogan {
	width: 760px;
	height: 59px;
	text-indent: -9999px;
	background: url("@{image_base_url}/slogan.png") center center no-repeat transparent;
}

#item-list {
	padding-left: 24px;
	border-bottom: 1px solid #ddd;
	.first {
		border: none;
	}
}

.item {
	border-top: 2px dashed #ff71b1;
}

.item-hd {
	padding-top: 33px;
	margin-bottom: 12px;
	.yahei();

	p {
		font-size: 16px;

		.item-tag {
			color: #b80600;
		}

		del {
			color: #33658a;
		}

		.item-price {
			color: #b80600;
		}
	}
}

.item-bd {
	overflow: hidden;

	.item-bd-col1 {
		width: 310px;
	}
	.item-bd-col2 {
		width: 415px;
	}
	.item-pic {
		width: 310px;
		height: 310px;

		a {
			display: block;
			width: 310px;
			height: 310px;
			text-align: center;

			img {
				margin: 0 auto;
			}
		}
	}

	.item-desc {
		padding: 6px 0 6px 36px;
		color: #5a5a5a;
		line-height: 22px;
		height: 113px;
		font-size: 14px;
		.yahei();


		strong {
			color: red;
		}
	}

	.item-review {
		padding-left: 36px;

		li {
			overflow: hidden;
			margin-top: 10px;

			img {
				width: 25px;
				height: 25px;
				float: left;
			}

			p {
				float: left;
				line-height: 25px;
				height: 25px;
			}
		}

		.first {
			margin-top: 0;
		}
	}

	.item-bd-col {
		float: left;
	}

	.item-action {
		.yahei();
		overflow: hidden;
		padding-left: 18px;

		.item-action-li {
			float: left;
		}

		.item-like,
		.item-collect {
			padding-top: 34px;
			height: 27px;
			width: 107px;

			p {
				overflow: hidden;

				a {
					width: 65px;
					height: 27px;
					text-indent: -9999px;
					float: left;
					background: url("@{image_base_url}/buttons.png") 0 0 no-repeat transparent;
				}

				.count {
					float: left;
					border: 1px solid #ff71b1;
					line-height: 24px;
					height: 24px;
					margin-left: 2px;
					padding: 0 3px;
					border-radius: 3px;
					behavior: url(http://www.100msm.com/assets/PIE-1.0.0/PIE.htc);
				}
			}
		}

		.item-like {
			margin-right: 11px;
		}

		.item-collect {
			margin-right: 3px;
		}

		.item-like p a {
			background-position: 0 -120px;
		}

		.item-collect p a {
			background-position: 0 -154px;
		}

		.item-buy {
			position: relative;
			width: 142px;
			padding-top: 30px;
			height: 36px;

			.count {
				position: absolute;
				left: 0;
				top: 0;
				width: 142px;
				height: 21px;
				font-size: 14px;
				color: #656565;

				strong {
					color: #cc092f;
				}
			}

			a {
				width: 162px;
				height: 38px;
				line-height: 38px;
				text-indent: 15px;
				font-size: 16px;
				color: #fff;
				display: block;
				background: url("@{image_base_url}/btn_buy.png") 0 0 no-repeat transparent;
			}
		}

	}
}

.item-ft {
	padding: 8px 0 15px;

	.item-share {
		width: 101px;
		height: 23px;
		text-indent: -9999px;
		display: block;
		background: url("@{image_base_url}/buttons.png") 0 -46px no-repeat transparent;
	}
}

#multi-tasks-modal {
	background-color: #e5e5e5;
	width: 548px;
	padding: 0;

	.modal-hd {
		h2 {
			height: 26px;
			line-height: 26px;
			color: #fff;
			font-size: 18px;
		}
	}

	.modal-bd {
		padding: 0 13px;

		li {
			padding: 10px;
			border-top: 1px dotted #c8c8c8;

			div {
				background: url("@{image_base_url}/tasks.png") 0 0 no-repeat transparent;
				height: 50px;
				line-height: 50px;
				overflow: hidden;
				padding-left: 57px;
				position: relative;

				.task-desc {
					color: #5a5a5a;
				}

				.task-btn {
					width: 77px;
					height: 29px;
					position: absolute;
					right: 41px;
					top: 10px;
					display: block;
					text-indent: -9999px;
					background: url("@{image_base_url}/btn_get.png") 0 0 no-repeat transparent;
				}

				.task-btn-disabled {
					background-position: 0 -32px;
				}
			}
		}

		#task-follow div {
			background-position: 0 0;
		}

		#task-checkin div {
			background-position: 0 -70px;
		}

		#task-invite div {
			background-position: 0 -140px;
		}

		#task-sendstory div {
			background-position: 0 -280px;
		}

		#task-collect div {
			background-position: 0 -350px;
		}
	}

	.modal-ft {
		display: none;
		background-color: #d8d8d8;
		padding: 19px 13px;

		div {
			padding: 0 10px;
			position: relative;

			h3 {
				color: #f4a;
				font-size: 14px;
				margin-bottom: 12px;
			}

			ul {
				overflow: hidden;
			}

			li {
				margin-right: 26px;
				float: left;
				width: 82px;

				img {
					width: 82px;
					height: 82px;
					margin-bottom: 5px;
				}
				a {
					color: #f4a;
				}
			}

			.more {
				position: absolute;
				top: 0;
				right: 0;
				color: #f4a;
			}
		}

	}
}

#single-task-modal {
	background-color: #e5e5e5;
	width: 234px;
	padding: 0;

	.modal-bd {
		height: 36px;
		padding: 22px 0 21px;
		text-align: center;

		.modal-bd-content {
			margin: 0 auto;
			width: 190px;
			font-size: 14px;

			em {
				color: red;
			}
		}
	}

	.modal-ft {
		text-align: center;
		padding-bottom: 13px;

		a {
			display: block;
			text-indent: -9999px;
			background: url("@{image_base_url}/btn_get.png") 0 0 no-repeat transparent;
			width: 77px;
			height: 29px;
			margin: 0 auto;
		}
	}
}

.modal-hd {
	background-color: #dc442f;
	height: 26px;
	padding-left: 12px;
}

.modal-close {
	border: 1px solid black;
	background-color: white;
	width: 24px;
	height: 24px;
	line-height: 24px;
	display: block;
	font-size: 24px;
	position: absolute;
	right: 0;
	top: 0;
}

#exchange {
	#points-count {
		float: left;
		width: 259px;
		height: 66px;
		margin-right: 14px;
		border: 1px solid #ffafa4;
		.rounded(5px);
		background: url("@{image_base_url}/points_icon.png") 35px center no-repeat #ffafa4;
	}

	#points-task {
		float: left;
		width: 430px;
		height: 66px;
		margin-right: 14px;
		border: 1px solid #ff5b44;
		.rounded(5px);
		background-color: #ff5b44;
	}

	#exchange-list {
		width: 707px;
		background-color: #ffafa4;
	}
}

#footer {
	padding: 15px 0;
	width: 740px;
	margin: 0 auto;
	text-align: center;
}

.jqmWindow {
	top: 100px;
}

#search-bar {
	margin: 29px auto 35px;
	width: 718px;
	height: 129px;
	background: url("@{image_base_url}/search_bar.png") 0 0 no-repeat transparent;


	ul {
		overflow: hidden;
		width: 1000px;
	}

	li {
		float: left;
	}

	a {
		float: left;
		width: 126px;
		height: 129px;
		margin-right: 22px;
		text-indent: -9999px;
	}
}